<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
	<meta charset="UTF-8">
	<title>捐赠-查看详细</title>
	<link rel="stylesheet" href="/css/bootstrap.min.css">
	<link rel="stylesheet" href="/css/index.css">
	<!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
	<link href="/css/materialdesignicons.min.css" rel="stylesheet">
	<link href="/css/style.min.css" rel="stylesheet">
	<script src="/js/jquery.min.js"></script>
	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script src="/js/bootstrap.min.js"></script>
</head>
<body class="body">
<div th:insert="~{navigation :: copy}"></div>
<div class="container">
	<h2 th:text="${tbMon.monName}"></h2>
	<hr>
	<div class="row">
		<!--<form  action='/news/getAllNews' id="form3" method='post' role="form">
			<input type="hidden" name="page" id="pageNo" th:value="${page}">
		</form>-->

		<div class="modal fade in" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="display: none; padding-right: 17px;">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
						<h4 class="modal-title" id="exampleModalLabel">捐款</h4>
					</div>
					<div class="modal-body">
						<form name="MonStuForm" id="MonStuForm" action="/mon/createNewMonStu"  method="post">
							<div class="form-group">
								<label>选择捐款方式</label>
								<div class="clearfix">
									<label class="lyear-radio radio-inline radio-primary">
										<input type="radio" name="monType" value="1" checked><span>在线支付</span>
									</label>
									<label class="lyear-radio radio-inline radio-primary">
										<input type="radio" name="monType" value="0"><span>手动捐款</span>
									</label>
								</div>
								<hr>
								<label for="moneyCount" class="control-label">输入捐款金额</label>
								<input type="text" class="form-control" id="moneyCount" name="moneyCount">
								<input type="hidden" class="form-control" id="monId" name="monId" th:value="${tbMon.monId}">
							</div>

						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
						<button type="button" class="btn btn-primary" id="MonStu">捐款</button>
					</div>
				</div>
			</div>
		</div>

		<div  class="col-lg-8">
			<dl class="row">
				<dt class="col-sm-3"><span>具体描述：</span></dt>
				<dd class="col-sm-9"><span th:text="${tbMon.monDesc}"></span></dd>
			</dl>
			<dl class="row">
				<dt class="col-sm-3"><span>筹款人：</span></dt>
				<dd class="col-sm-9"><span th:text="${tbMon.tbStu.name}"></span></dd>
			</dl>

			<dl class="row">
				<dt class="col-sm-3"><span>状态：</span></dt>
				<dd class="col-sm-9"><span th:if="${tbMon.monStatus}==0">未开始</span></dd>
				<dd class="col-sm-9"><span th:if="${tbMon.monStatus}==1">正在进行</span></dd>
				<dd class="col-sm-9"><span th:if="${tbMon.monStatus}==2">已结束</span></dd>
			</dl>

			<dl class="row">
				<dt class="col-sm-3"><span>需要金额：</span></dt>
				<dd class="col-sm-9"><span th:text="${tbMon.monCount}"></span></dd>
			</dl>

			<dl class="row">
				<dt class="col-sm-3"><span>已筹金额：</span></dt>
				<dd class="col-sm-9"><span th:text="${tbMon.monHad}"></span></dd>
			</dl>



			<dl class="row">
				<dt class="col-sm-3"><span>项目发起时间：</span></dt>
				<dd class="col-sm-9"><span th:text="${#temporals.format(tbMon.monTime,'yyyy-MM-dd')}"></span></dd>
			</dl>
		</div>

		<div class="col-lg-2">
			<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">我要参与捐款</button>
			<button class="btn btn-info btn-w-md" type="button" onclick="showMonStuByMonId()" style="margin-top: 20px;">已捐赠人名单</button>
		</div>
	</div>
</div>
<script type="text/javascript" src="/js/axios.min.js"></script>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript">
function showMonStuByMonId() {
    var monId=[[${tbMon.monId}]];
	location.href="/mon/getMonStuById?monId="+monId;
}

$("#MonStu").click(function () {
    var status=[[${tbMon.monStatus}]];
    var moneyCount=$('#moneyCount').val();
    if(status==0){
        alert("项目未开始");
		return;
	}else if(status==2){
        alert("项目已结束");
		return;
	}else if (moneyCount==""){
        alert("请输入捐款金额");
		return;;
	}
    $("#MonStuForm").submit();
})

</script>

</body>
</html>